// 封装ajax函数
// 兼容GET和POST请求
function ajaxFn({baseUrl, url, method, data={}, headers={}, callBack }){
    // baseUrl 基础路径(http://127.0.0.1:3000)
    // url 接口地址（api/xxx）
    // method 请求方式（GET,POST,PUT)
    // data 请求参数（get 和 post统一使用json格式）
    // headers 请求头
    // callBack 回调函数（接收数据）

    let xhr = new XMLHttpRequest();

    // 判断是否为GET请求，参数是需要拼接在url上
    let query = '?';
    if(Object.keys(data).length){
        for(const key in data){
            query += `${key}=${data[key]}&`
        }
    };
    function setHeaders(){
        // 设置请求头
        if(Object.keys(headers).length){
            for(const key in headers){
                const element = headers[key];
                xhr.setRequestHeader(key, element);
            }
        }
    }
    if(method.toUpperCase() === 'GET'){
        // baseUrl + url + ?type=0&id=111
        xhr.open(method, baseUrl + url + query.slice(0,-1));
        setHeaders();
        xhr.send(JSON.stringify(data));
    }else{
        xhr.open(method, baseUrl + url);
        setHeaders();
        // 请求体要求发送一个json字符串
        xhr.send(JSON.stringify(data));
    }

    // 监听xhr对象请求的状态
    xhr.addEventListener("readystatechange",()=>{
        if(xhr.readyState === 4){
            if(xhr.status === 200){
                // console.log(xhr.response);
                callBack(JSON.parse(xhr.response));
            }else{
                //可能出现的报错，一般后端都会响应报错信息，也需要返回出去到回到函数
                callBack(JSON.parse(xhr.response));
                // console.log(xhr.response);
            }
        }
    });
    
}

